<%@ page language="java" contentType="text/html; charset=GBK" pageEncoding="utf-8"%>
<!DOCTYPE html>
<html  style="text-align:center;">

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=GBK" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=0.4, user-scalable=no" />  <!-- 移动端用户不可缩放页面 -->
  <title>华工xx同乡会</title>
  <link rel="stylesheet" type="text/css" href="css/ActionHomePage/style.css" />
  <link rel="stylesheet" type="text/css" href="css/AdminManage/AdminManage.css" />
  <link rel="stylesheet" type="text/css" href="css/public/public_buttonAndInput.css" />
  <script src="js/public/jquery-2.1.4.min.js"></script>
  <script src="js/ActionHomePage/singleActionInfo/singleActionInfoScript.js"></script>
  <script src="js/AdminManage/AdminManage.js"></script>
  <script src="js/ActionHomePage/script.js"></script>
  <script src="js/public/publicScript.js"></script>
  <script src="js/ckeditor/ckeditor.js"></script>
  <script type="text/javascript">
	 
     window.id ='<% out.print(session.getAttribute("id")); session.removeAttribute("id");%>';
     window.uid='<% out.print(session.getAttribute("user_id"));%>';
     window.sid='<% out.print(session.getId());%>';
	 window.totalSize = 0;
	 window.currentSize = 0;
	 
	 window.onload = function(){
		 load();
	 }
	 
	 function count(initZero){
		 var count = initZero=="true"?1:$('#album_pic_list').children().length;
	     $('#current_pics_num').html(count-1);
	     $('#able_up_pics_num').html(20-count+1);
	 }
/* 	 function showPic(){
	  var pics = $("#pic").get(0).files;
	  
	  for(var i=0;i<pics.length;i++)
		console.info(pics[i]);

	  for(var i=0;i<pics.length;i++)
		uploadFile(pics[i],i+1,pics.length);
	  
	  //$("img").prop("src" , window.URL.createObjectURL(pic) );
	  //uploadFile();
	 } */
	 
	 function loadDelPic($this){
		 var pid = $this.attr("id");
		 if(confirm("确定删除照片？(删除后不可恢复)")){
			 $.ajax({
				url: IMAGE_SERVER_HOST+IMAGE_APP+"delAlbumPic.php"+"?aid="+window.id+"&sid="+sid+"&uid="+uid+"&pid="+pid,
				datatype:'json',
				type: "POST",
	  	        processData:false,
				success:function(data){
					alert('删除成功.');
					$this.parent().remove();
					count("false");
	                //addAlbumInfo(data);
				},
				error:function(data){
					alert('数据加载失败...服务器连接失效或者请检查网络连接是否正常...')
				}			 
			 });
		 }
	 }

	 function addTopAlbum(){
		 $.ajax({
				url: "AddTopAlbum"+"?aid="+window.id,
				datatype:'json',
				type: "POST",
	  	        processData:false,
				success:function(data){
					if(data['succ']=="true")
					   alert('置顶成功.');
					else
					   alert(data['errMsg']);
	                //addAlbumInfo(data);
				},
				error:function(data){
					alert('数据加载失败...服务器连接失效或者请检查网络连接是否正常...')
				}			 
			 });		 
	 }
	 
	 function clearProgress(){
	  $("#son").html( 0 +"%" );
	  $("#son").css("width" , 0 +"%");
	 }

	 function uploadFiles(){
	  var pics = $("#pic").get(0).files;
	  for(var i=0;i<pics.length;i++){
		console.info(pics[i]);
		window.totalSize += pics[i].size;
	  }
	  for(var i=0;i<pics.length;i++)
		uploadFile(pics[i],i+1,pics.length);
	 }


	 function uploadFile(pic,current,total){
	  var formData = new FormData();
	  formData.append("file",pic);  
	  $.ajax({
	    url: IMAGE_SERVER_HOST+IMAGE_APP+"upAlbumPic.php"+"?aid="+window.id+"&sid="+sid+"&uid="+uid+"&num="+current,
		type: 'POST',
		data: formData,
		dataType: 'json',
		async: true,
		cache: false,
		contentType: false,
		processData: false,
	    success: function(returndata){
			 console.info(returndata);
			 if(returndata['accept']=='true'){
				 window.currentSize += pic.size;
			     onprogress(window.currentSize,window.totalSize);
			     var content = "";
				 var head = "<div style=\"display:inline-block;padding-top:20px;border-color:#FFFFFF;border-style:solid;border-width:2px;border-radius:3px;\" onmouseover=\"changeBorderB($(this));\" onmouseout=\"resetBorderB($(this));\">";
				 var img_pic = "<img src=\"" + returndata['url'] + "\" style=\"width:320px;heigth:200px;\"/><br/><br/>";
			     var rend = "<div class='tagBtn' "+" id='' "+" onmouseover='cbcb($(this));cc($(this));' onmouseout='cbc($(this));ccb($(this));'><span>要删除请刷新</span></div><br/><br/></div>";
			     content += (head+img_pic+rend);
			     $("#album_pic_list").append(content);
			     count("false");
			 }
	    },
	    error:function(returndata){
			 console.info(returndata);
			 window.currentSize += pic.size;
			 onprogress(window.currentSize,window.totalSize);
	    }
	  });
	 }

	/**
	 *
	 *改变进度条
	 *
	 **/
	 function onprogress(current,total){
	  var per = Math.floor(100*current/total);  //已经上传的百分比 
	  $("#son").html( per +"%" );
	  $("#son").css("width" , per +"%");
	 }
	 
	 
	 function load(){
		 $.ajax({
			url:'CheckUserSingleAlbum',     
			datatype: "json",
			data:"aid="+window.id,
			type: "POST",
  	        processData:false,
			success:function(data){
                addAlbumInfo(data);
       		    count(data['result']['album_pics'].length==0?"true":"false");
			},
			error:function(){
				alert('数据加载失败...服务器连接失效或者请检查网络连接是否正常...')
			}			 
		 });
	 }
	 
	 function addAlbumInfo(data){
		 $("#album_name")[0].value = data['result']['album_name'];
		 $("#top_pic").attr("src",getThumb(data['result']['top_pic'],"320200"));
		 
		 if(data['result']['album_pics'].length>0){
			 $("#album_pic_list").empty();
			 var top_topic = "<h3>相册图片</h3>";
			 var content = "";
			 for(var i=0;i<data['result']['album_pics'].length;i++){
				 var head = "<div style=\"display:inline-block;padding-top:20px;border-color:#FFFFFF;border-style:solid;border-width:2px;border-radius:3px;\" onmouseover=\"changeBorderB($(this));\" onmouseout=\"resetBorderB($(this));\">";
				 var img_pic = "<img src=\"" + getThumb(data['result']['album_pics'][i]['url'],"320200") + "\" style=\"width:320px;heigth:200px;\"/><br/><br/>";
			     var rend = "<div class='tagBtn' "+" id='"+data['result']['album_pics'][i]['id']+"' "+" onmouseover='cbcb($(this));cc($(this));' onmouseout='cbc($(this));ccb($(this));' onclick='loadDelPic($(this))'><span>删除</span></div><br/><br/></div>";
			     content += (head+img_pic+rend);
			 }
		     $("#album_pic_list").html(top_topic+content);			 
		 }else{
			 $("#album_pic_list").empty();
			 var top_topic = "<h3>相册图片</h3>";
			 var content = "<br/><br/>你还没有上传相片...<br/><br/>";
			 $("#album_pic_list").html(top_topic+content);
		 }
/* 		 var editor = CKEDITOR.replace("editor1");
		 editor.setData(data['result']['introduction']); */
		 CKEDITOR.instances.editor1.setData(data['result']['introduction']);
		 //$("#editor1")[0].value = data['result']['introduction'];
	 }
	 
	 function uoloadTopPic(){
		 var pics = $("#top_pic_file").get(0).files;
		 var formData = new FormData();
		 formData.append("file",pics[0]);
		 
		 $.ajax({
				url:IMAGE_SERVER_HOST+IMAGE_APP+"upAlbumTopPic.php"+"?aid="+window.id+"&sid="+sid+"&uid="+uid,     
				type: 'POST',
				data: formData,
				dataType: 'json',
				async: true,
				cache: false,
				contentType: false,
				processData: false,
				success:function(data){
					if(data['accept']=="false")
						alert("上传首页图片失败...");
					else if(data['accept']=="true"){
						alert("上传成功.");						
						$("#top_pic").attr("src",data['url']);
					}
				},
				error:function(data){
					alert('数据加载失败...服务器连接失效或者请检查网络连接是否正常...')
				}		 
		 });		 
	 }
	 
	 function loadModify(){
		 var _album_name = "album_name="+$("#album_name")[0].value;
		 var _intro = "introduction="+CKEDITOR.instances.editor1.getData();
		 $.ajax({
				url:'ModifyAlbum',     
				datatype: "json",
				data:"aid="+window.id+"&"+_album_name+"&"+_intro,
				type: "POST",
	  	        processData:false,
				success:function(data){
					if(data['succ']=="true")
						alert("修改成功");
					else if(data['succ']=="false")
					    alert(data['errMsg']);
				},
				error:function(){
					alert('数据加载失败...服务器连接失效或者请检查网络连接是否正常...')
				}		 
		 });		 
	 }
	 
	 function loadDelAlbum(){
		 if(confirm("确定删除相册？（删除后不可恢复）")){
			 $.ajax({
					url:IMAGE_SERVER_HOST+IMAGE_APP+'delAlbum.php',     
					datatype: "json",
					data:"aid="+window.id+"&sid="+window.sid+"&uid="+window.uid,
					type: "POST",
		  	        processData:false,
					success:function(data){
						if(data['succ']=="true"){
							alert("删除相册成功");
							window.location = 'html/AdminManage/albumList.html';
						}
						else if(data['succ']=="false")
						    alert('删除失败...请稍后重试.');
					},
					error:function(){
						alert('数据加载失败...服务器连接失效或者请检查网络连接是否正常...')
					}		 
			 });
		 }
	 }
	 
  window.onresize=function(){
 	 var w=window.innerWidth
      || document.documentElement.clientWidth
      || document.body.clientWidth;
      var _w = parseInt(w);   //获取屏幕宽度
      if(_w>1200){
 		 var v = (_w -1200)/2;
 		 _w = 1200;
 		 $("#wrap").css("width","1200px");
 		 $("#wrap").css("margin-left",(v-8)+"px");
         $("#wrap").css("margin-right",(_w+v-8)+"px");
         
         $(".blackC_t").css("width","1200px");
         $(".blackC_t").css("height","120px");         
         $("#tbar").css("width","1200px"); 
         $("#tbar").css("height","120px"); 
         
      }else{
 		 $("#wrap").css("width","100%");
 		 $("#wrap").css("margin-left",-8+"px");
         //$("#wrap").css("margin-right",-8+"px");
         
         $(".blackC_t").css("width",_w+"px");
         $(".blackC_t").css("height",(_w*0.1)+"px");
         $("#tbar").css("width",_w+"px");
         $("#tbar").css("height",(_w*0.1)+"px");
      }
  }
  </script>
  <style type="text/css">
		.inputTxt:focus{
			border-color:rgba(0,255,255,.75);
			box-shadow:0px 0px 6px 2px rgba(0,255,255,.5);
			-moz-box-shadow:0px 0px 6px 2px rgba(0,255,255,.5);
			-webkit-box-shadow:0px 0px 6px 2px rgba(0,255,255,3);
			-o-transition:0px 0px 6px 2px rgba(0,255,255,3);
		}

		.inputTxt{
		   border-color: #00CCFF;
		} 
		
  </style>
</head>

<body style="width:100%;height:100%;background-color:#333333;">
   <div id="wrap" style="width:100%;margin-top:-8px;margin-left:-8px;height:100%;">
   	 <div class="blackC_t">
	 </div>
     <div id="tbar" class="topbar">
	  <div style="display:inline;">
	     <img style="max-width:8.296%;max-height:80%;vertical-align: middle;width:8.296%;height:80%;" src="image/homepage/u6.png"/>
	  </div>
	  <div style="font-family:微软雅黑;color:#00CCFF;display:inline;">
	     <div style="display:inline;">
		   <span>
	          <strong>华工xx同乡会</strong>
	       </span>
		 </div>
		 <div style="padding-left:18%;display:inline;">
		   <div class="barEl" onmouseover="cc($(this))" onmouseout="ccb($(this))"style="color:#00CCFF;" onclick="window.location = 'http://139.129.24.81:8082/scuthnhtml/html/homepage/homepage.html';">首页</div>&nbsp;&nbsp;&nbsp;
           <div class="barEl" onmouseover="cc($(this))" onmouseout="ccg($(this))"style="color:#CCFF00;" onclick="window.location = 'http://139.129.24.81:8082/scuthnhtml/html/ActionHomePage/actionHomePage.html';">活动中心</div>&nbsp;&nbsp;&nbsp;
           <div class="barEl" onmouseover="cc($(this))" onmouseout="ccr($(this))"style="color:#FF9900;">资讯</div>&nbsp;&nbsp;&nbsp;
           <%
	            String i = (String)session.getAttribute("user_account");
	           	if(i==null)
	           		out.print("<div class=\"barEl\" onmouseover=\"cc($(this))\" onmouseout=\"ccb($(this))\" onclick=\"window.location='pfs?p=login/login.jsp';\">登录</div>&nbsp;&nbsp;&nbsp;"+
	 	                      "<div class=\"barEl\" onmouseover=\"cc($(this))\" onmouseout=\"ccg($(this))\" onclick=\"window.location='pfs?p=register/register.jsp';\" style=\"color:#CCFF00;\">注册</div>&nbsp;&nbsp;&nbsp;");
	           	else
	           		out.print("<div class=\"barEl\" onmouseover=\"cc($(this))\" onmouseout=\"ccb($(this))\" onclick=\"window.location='CheckUserInfo';\" >"+i+"</div>&nbsp;&nbsp;&nbsp;"+
	 	                      "<div class=\"barEl\" onmouseover=\"cc($(this))\" onmouseout=\"ccg($(this))\" onclick=\"window.location='LoginOut';\" style=\"color:#CCFF00;\">退出</div>&nbsp;&nbsp;&nbsp;");	            
	 	    %>        
		 </div>
	  </div>
     </div>
     <div id="top" style="background-color:#333333;text-align:left;width:100%;">
       <div style="padding:10% 0% 10% 0%;color:#FFFFFF;">
         <div style="display:inline;margin-left:40%;">
            <span style="font-family:微软雅黑;font-size:3em;">
               <strong>管理员中心</strong>
            </span>
         </div>
       </div>
     </div>
     <div id="v" style="font-family:微软雅黑;background-color:#FFFFFF;width:100%;">
        <br/>
        <span style="color:#333333;font-family:Microsoft YaHei;font-size:2em;">
           <strong>活动管理</strong>
        </span><br/><br/>
		<a href="" style="color:#00CCFF;">创建新相册</a>
		<br/><br/><br/>
        <div>
           <div style="background-color:#FFFFFF;width:70%;display:inline-block;vertical-align:top;">     
               <div style="padding-left:0%;text-align:center;">
		           <h3>相册详情</h3>
				   <form>
						   <table style="width:100%">
								<tr>
									<td>相册名称:<br/><br/></td>
									<td>
									   <input id="album_name" name="album_name" class="inputTxt" type="text" style="width:50%;margin-left:-25%;" value="sdfsdf"/><br/><br/>
									</td>
								</tr>
								<tr>
									<td>相册简介:<br/><br/></td>
									<td>
				                       <textarea name="link" id="editor1" rows="10" cols="80">
				                       </textarea><br/><br/>
									   <script>
									      
									      CKEDITOR.replace( 'editor1',{ width:'90%'});
				                       </script>
									</td>
								</tr>
						   </table>
				   </form>
				   <div class="tagBtn" onmouseover="cbcb($(this));cc($(this));" onmouseout="cbc($(this));ccb($(this));" onclick="loadModify();">
				     <span>
					   确认修改
				     </span>
				   </div><br/><br/>

				   <div>
				     <h3>相册首页图片</h3>
				     <img id="top_pic" style="width:320px;heigth:100px;"/><br/>
				     <input type="file" id="top_pic_file" name="top_pic_file"/><br/>
					 <div class="tagBtn" onmouseover="cbcb($(this));cc($(this));" onmouseout="cbc($(this));ccb($(this));" onclick="uoloadTopPic();">
				       <span>
					              上传首页图片
				       </span>
				     </div>
				   </div><br/><br/>

				   <div id="album_pic_list">
<!-- 				     <div style="display:inline-block;padding-top:20px;"  onmouseover="changeBorderB($(this));" onmouseout="resetBorderB($(this));">
					   <img src="../../image/default/tree.png " style="width:320px;heigth:200px;"/><br/><br/>
					   <div class="tagBtn" onmouseover="cbcb($(this));cc($(this));" onmouseout="cbc($(this));ccb($(this));" >
				         <span>
					       删除
				         </span>
				       </div><br/><br/>
					 </div>
				     <div style="display:inline-block;padding-top:20px;" onmouseover="changeBorderB($(this));" onmouseout="resetBorderB($(this));">
					   <img src="../../image/public/slides/slide2.jpg" style="width:320px;heigth:200px;"/><br/><br/>
					   <div class="tagBtn" onmouseover="cbcb($(this));cc($(this));" onmouseout="cbc($(this));ccb($(this));" >
				         <span>
					       删除
				         </span>
				       </div><br/><br/>
					 </div> -->
				   </div>
				   
				   <div>
				       <form>
						   <input type="file" id="pic" name="pic"  multiple="multiple" onchange="clearProgress();"/>
					   </form><br/><br/>
					   <div id="albms_count">
					                  当前相册<span id="current_pics_num"></span>张相片，你还可以上传<span id="able_up_pics_num"></span>张照片
					   </div><br/><br/>
					   <div id="parent">
						   <div id="son">
						   </div>
					   </div>
					   <div class="tagBtn" onmouseover="cbcb($(this));cc($(this));" onmouseout="cbc($(this));ccb($(this));"  onclick="uploadFiles();" >
					     <span>
						   上传图片
					     </span>
					   </div><br/><br/>
					   <div class="tagBtn" onmouseover="cbcb($(this));cc($(this));" onmouseout="cbc($(this));ccb($(this));" onclick="loadDelAlbum();">
					     <span>
						   删除相册
					     </span>
					   </div>
					   <div class="tagBtn" onmouseover="cbcb($(this));cc($(this));" onmouseout="cbc($(this));ccb($(this));" onclick="addTopAlbum();">
					     <span>
						   置顶相册
					     </span>
					   </div><br/><br/>
				   </div>
				   
               </div>
           </div>
           <div style="box-shadow:0px 0px 8px 0px;border-radius:4px;background-color:#00FFFF;width:20%;display:inline-block;">
           	   <div class="si">
           	   	   <span style="color:#333333;">
           	   	      <strong>管理面板</strong>
           	   	   </span>
           	   	   <ul style="list-style:none;margin-left:-40px;">
           	   	   	  <li>
           	   	   	  	<div class="ncBoard" onmouseover="mouseOverNcboard($(this));" onmouseout="mouseOutNcboard($(this));">
           	   	   	  		<span>
           	   	   	  			用户管理
           	   	   	  		</span>
           	   	   	  	</div>
           	   	   	  </li>
           	   	   	  <li>
           	   	   	  	<div  class="wcBoard">
           	   	   	  		<span>
           	   	   	  			活动管理
           	   	   	  		</span>
           	   	   	  	</div>
           	   	   	  </li>
           	   	   	  <li>
           	   	   	  	<div class="xncBoard" onmouseover="mouseOverNcboard($(this));" onmouseout="mouseOutNcboardx($(this));">
           	   	   	  		<span>
           	   	   	  			我的活动
           	   	   	  		</span>
           	   	   	  	</div>
           	   	   	  </li>
           	   	   	  <li>
           	   	   	  	<div class="wcBoard">
           	   	   	  		<span>
           	   	   	  			我的相册
           	   	   	  		</span>
           	   	   	  	</div>
           	   	   	  </li>
					  <li>
           	   	   	  	<div class="ncBoard" onmouseover="mouseOverNcboard($(this));" onmouseout="mouseOutNcboard($(this));">
           	   	   	  		<span>
           	   	   	  			资源共享管理
           	   	   	  		</span>
           	   	   	  	</div>
           	   	   	  </li>
					  <li>
           	   	   	  	<div class="ncBoard" onmouseover="mouseOverNcboard($(this));" onmouseout="mouseOutNcboard($(this));">
           	   	   	  		<span>
           	   	   	  			咨询中心
           	   	   	  		</span>
           	   	   	  	</div>
           	   	   	  </li>
					  <li>
           	   	   	  	<div class="ncBoard" onmouseover="mouseOverNcboard($(this));" onmouseout="mouseOutNcboard($(this));">
           	   	   	  		<span>
           	   	   	  			通知中心
           	   	   	  		</span>
           	   	   	  	</div>
           	   	   	  </li>
					  <li>
           	   	   	  	<div class="ncBoard" onmouseover="mouseOverNcboard($(this));" onmouseout="mouseOutNcboard($(this));">
           	   	   	  		<span>
           	   	   	  			超级管理员
           	   	   	  		</span>
           	   	   	  	</div>
           	   	   	  </li>
			
           	   	   </ul>
           	   </div>
           </div>
        </div>
        <br/><br/>    
     </div>
     <div id="foot" style="font-family:微软雅黑;border-radius:6px;margin-top:-5%;box-shadow: 0px 0px 18px 0px;width:100%;height:30%;background-color:#CCCCCC;left:0px;bottom:0px;">   
       <div style="font-family:微软雅黑;margin-top:5%;">  
	     <div>
	        <a target="_blank" style="text-decoration:none;" href="#"><span class="si">联系我们</span></a>
	     </div><br/>
	     <div style="font-family:微软雅黑;display:inline;">
		      <div class="barEl" onmouseover="cc($(this))" onmouseout="ccB($(this))"><span class="si">首页</span></div>&nbsp;&nbsp;&nbsp;
              <div class="barEl" onmouseover="cc($(this))" onmouseout="ccB($(this))"><span class="si">活动</span></div>&nbsp;&nbsp;&nbsp;
              <div class="barEl" onmouseover="cc($(this))" onmouseout="ccB($(this))"><span class="si">资讯</span></div>&nbsp;&nbsp;&nbsp;
              <div class="barEl" onmouseover="cc($(this))" onmouseout="ccB($(this))"><span class="si">管理员中心</span></div>&nbsp;&nbsp;&nbsp;
	     </div><br/>
	     <div>
	          <a target="_blank" style="text-decoration:none;" href="http://www.scut.edu.cn/"><span style="color:#999999;" class="xsi">友情链接:华南理工大学官网</span></a>
	     </div><br/>
	     <div>
	        <span class="xsi">备案信息:xxxxxxxxxxxxxxxxxxxxxx</span>
	     </div>
	   </div>
     </div>
   </div>   
</body>

<script type="text/javascript">
	 var w=window.innerWidth
     || document.documentElement.clientWidth
     || document.body.clientWidth;
     var _w = parseInt(w);   //获取屏幕宽度
     
	 if(_w>1200){
		 var v = (_w -1200)/2;
		 _w = 1200;
		 $("#wrap").css("width","1200px");
		 $("#wrap").css("margin-left",(v-8)+"px");
         $("#wrap").css("margin-right",(_w+v-8)+"px");
         $(".blackC_t").css("width","1200px");
         $(".blackC_t").css("height",_w*0.1);
         $("#tbar").css("width","1200px"); 
         $("#tbar").css("height",_w*0.1);
	 }else{
		 $("#wrap").css("width","100%");
		 $("#wrap").css("margin-left",-8+"px");
         //$("#wrap").css("margin-right",_w+"px");
         
         $(".blackC_t").css("width",_w+"px");
         $(".blackC_t").css("height",_w*0.1);
         $("#tbar").css("width",_w+"px");  
         $(".blackC_t").css("height",_w*0.1);
	 }
</script>
</html> 